<!DOCTYPE html>
<html>
<head>
<title>添加参数</title>
[#include "/WEB-INF/admin/include/common.html"]
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>添加参数</h5>
            </div>
           <form id="inputForm" action="save" method="post">
	            <div class="ibox-content">
	                <div class="form-horizontal clearfix">
	                    <div class="form-group">
	                        <label class="col-sm-3 control-label">绑定分类：</label>
	                        <div class="col-sm-3">
	                           <select class="form-control" name="productCategoryId">
	                               [#list productCategoryTree as productCategory]
										<option value="${productCategory.id}">
											[#if productCategory.grade != 0]
												[#list 1..productCategory.grade as i]
													&nbsp;&nbsp;
												[/#list]
											[/#if]
											${productCategory.name}
										</option>
									[/#list]
	                            </select>
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-sm-3 control-label">参数组：</label>
	                        <div class="col-sm-3">
	                            <input placeholder="参数组" class="form-control" type="text" name="subgroup">
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-sm-3 control-label">排序：</label>
	                        <div class="col-sm-3">
	                            <input placeholder="排序" class="form-control" type="text" name="sort">
	                        </div>
	                    </div>
              	        <div class="form-group">
	                        <label class="col-sm-3 control-label">&nbsp;</label>
	                        <div class="col-sm-3">
	                            <a class="btn btn-primary" href="javascript:;" id="addNameButton"><i class="fa fa-plus"></i>增加参数名称</a>
	                        </div>
	                    </div>
	                    <div class="form-group">
	                    	<label class="col-sm-3 control-label">&nbsp;</label>
	                    	<div class="col-sm-3">
		                        <table class="table table-bordered" id="nameTable">
		                            <thead>
		                                <tr>
		                                    <th>参数名称</th>
		                                    <th>操作</th>
		                                </tr>
		                            </thead>
		                            <tbody>
		                            	[#if sample??]
											[#list sample.names as name]
												<tr>
													<td>
														<input type="text" name="name" class="form-control" value="${name}" />
													</td>
													<td>
														<a href="javascript:;" class="remove">[删除]</a>
													</td>
												</tr>
											[/#list]
										[#else]
											<tr>
												<td>
													<input type="text" name="name" class="form-control"/>
												</td>
												<td>
													<a href="javascript:;" class="remove">[删除]</a>
												</td>
											</tr>
										[/#if]
		                            </tbody>
		                        </table>
			                </div>
	                    </div>
	                </div>
	            </div>
	            <div class="modal-footer col-sm-3 col-sm-offset-2">
	                <button type="submit" class="btn btn-w-m btn-primary">确定</button>
	                <button type="button" class="btn btn-w-m btn-default" onclick="history.back(); return false;">取消</button>
	            </div>
            </form>
        </div>
    </div>
</body>
</html>
<script type="text/javascript">
$().ready(function() {

	var $inputForm = $("#inputForm");
	var $addNameButton = $("#addNameButton");
	var $nameTable = $("#nameTable");
	
	// 增加参数名称
	$addNameButton.click(function() {
		$nameTable.append(
			[@compress single_line = true]
				'<tr>
					<td>
						<input type="text" name="name" class="form-control" \/>
					<\/td>
					<td>
						<a href="javascript:;" class="remove">[删除]<\/a>
					<\/td>
				<\/tr>'
			[/@compress]
		);
	});
	
	// 删除参数名称
	$nameTable.on("click", "a.remove", function() {
		if ($nameTable.find("tr").size() <= 2) {
			alert("删除失败，必须至少保留一项");
			return false;
		}
		$(this).closest("tr").remove();
	});
	
	// 表单验证
	$inputForm.validate({
		rules: {
			productCategoryId: "required",
			group: "required",
			sort: "digits",
			names: "required"
		}
	});

});
</script>